<a href="http://github.com/angular/angular.js/tree/v1.2.0rc1/src/ng/animate.js#L5" class="view-source btn btn-action"><i class="icon-zoom-in"> </i> View source</a><a href="http://github.com/angular/angular.js/edit/master/src/ng/animate.js" class="improve-docs btn btn-primary"><i class="icon-edit"> </i> Improve this doc</a><h1><code ng:non-bindable="">$animateProvider</code>
<div><span class="hint">service in module <code ng:non-bindable="">ng</code>
</span>
</div>
</h1>
<div><h2 id="Description">Description</h2>
<div class="description"><div class="ng-animateprovider-page"><p>Default implementation of $animate that doesn&#39;t perform any animations, instead just synchronously performs DOM
updates and calls done() callbacks.</p>
<p>In order to enable animations the ngAnimate module has to be loaded.</p>
<p>To see the functional implementation check out src/ngAnimate/animate.js</p>
</div></div>
<div class="member method"><h2 id="Methods">Methods</h2>
<ul class="methods"><li><h3 id="register">register(name, factory)</h3>
<div class="register"><div class="ng-animateprovider-register-page"><p>Registers a new injectable animation factory function. The factory function produces the animation object which
contains callback functions for each event that is expected to be animated.</p>
<ul>
<li><code>eventFn</code>: <code>function(Element, doneFunction)</code> The element to animate, the <code>doneFunction</code> must be called once the
element animation is complete. If a function is returned then the animation service will use this function to
cancel the animation whenever a cancel event is triggered.</li>
</ul>
<pre class="prettyprint linenums">
  return {
    eventFn : function(element, done) {
      //code to run the animation
      //once complete, then run done()
      return function cancellationFunction() {
        //code to cancel the animation
      }
    }
  }
</pre>
</div><h5 id="parameters">Parameters</h5><table class="variables-matrix table table-bordered table-striped"><thead><tr><th>Param</th><th>Type</th><th>Details</th></tr></thead><tbody><tr><td>name</td><td><a href="" class="label type-hint type-hint-string">string</a></td><td><div class="ng-animateprovider-register-page"><p>The name of the animation.</p>
</div></td></tr><tr><td>factory</td><td><a href="" class="label type-hint type-hint-function">function</a></td><td><div class="ng-animateprovider-register-page"><p>The factory function that will be executed to return the animation object.</p>
</div></td></tr></tbody></table></div>
</li>
</ul>
</div>
</div>
